<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>会员注册表单样式</title>
</head>
<style>
    .input {
        width: 300px;
        height: 30px;
        border: 1px solid ■#ccc;
        border-radius: 5px;
        padding-left: 20px;
        outline: none;
        border: none;
        border-bottom: 2px solid #ccc;
    }

    .btn {
        width: 90px;
        height: 40px;
        background-color: □ Irgb(37, 4, 246);
        color: - white;
        border: none;
        margin-top: 10px;
        margin-right: 30px;
    }

    ·jj {
        height: 80px;
        resize: none;
        /*禁止文本域大小随意拖拽*/
    }

    /*属性选择器*/
    input[type=submit] {
        background-color: red;
        color: white;
        border-radius: 5px;
        letter-spacing: 5px;
    }

    #uname {
        background: url(img/search.png)no-repeat 5px center;
        background-size: 4%;
    }

    #uname:focus {
        background-color: laqua;
    }
</style>

<body>
    <table>
        <caption>会员注册</caption>
        <tr>
            <th>账户:</th>
            <td>
                <input type="text" id="uname" class="input" placeholder="请输入手机号或邮箱">
            </td>
        </tr>
        <tr>
            <th>密码:</th>
            <td>
                <input type="password" class="input" placeholder="请输入密码">
            </td>
        </tr>
        <tr>
            <th>确认密码:</th>
            <td>
                <input type="password" class="input" placeholder="请输入确认密码">
            </td>
        </tr>
        <tr>
            <th>性别:</th>
            <td>
                <input type="radio" name="sex" checked>男
                <input type="radio" name="sex">女
            </td>
        </tr>
        <tr>
            <th>所在城市:</th>
            <td>
                <select name="" class="input" id="">
                    <option value="0">---请选择---</option>
                    <option value="1">河北</option>
                    <option value="2">河南</option>
                    <option value="3">上海</option>
                    <option value="4">北京</option>
                    <option value="5">广西</option>
                    <option value="6">广东</option>
                </select>
            </td>
        </tr>
        <tr>
            <th>兴趣爱好:</th>
            <td>
                <input type="checkbox" name="ah">篮球
                <input type="checkbox" name="ah">足球
                <input type="checkbox" name="ah">排球
                <input type="checkbox" name="ah">羽毛球
                <input type="checkbox" name="ah">乒乓球
            </td>
        </tr>
        <tr>
            <th>个人简介:</th>
            <td>
                <textarea name="" id="" class="input jj" cols="30" rows="5"></textarea>
            </td>
        </tr>
        <tr>
            <th></th>
            <td>
                <input type="submit" class="btn" value="提交">
                <input type="reset" class="btn" value="重置">
            </td>
        </tr>
        </td>
        </tr>
    </table>
</body>

</html>